﻿﻿@model BlendModel

@using Telerik.Web.Mvc.UI;

@Html.ValidationSummary(false)

@Html.HiddenFor(model => model.Id)
@Html.Telerik().TabStrip().Name("blend-edit").Items(x =>
{
    x.Add().Text("Blend").Content(TabInfo().ToHtmlString()).Selected(true);
    x.Add().Text("Blend Beans").Content(BlendBeanInfo().ToHtmlString());

    //generate an event
    EngineContext.Current.Resolve<IEventPublisher>().Publish(new AdminTabStripCreated(x, "blend-edit"));
})
@helper TabInfo()
{ 
    <table class="adminContent">
        <tr>
            <td class="adminTitle">
                Blend Name:
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.Name)
                @Html.ValidationMessageFor(model => model.Name)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.Description):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.Description)
                @Html.ValidationMessageFor(model => model.Description)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.IsActive):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.IsActive)
                @Html.ValidationMessageFor(model => model.IsActive)
            </td>
        </tr>
    </table>
    
}

@helper BlendBeanInfo()
{ 
    if (Model.Id > 0)
    {

        /*hide "add blend" table if no blend beans are defined*/
        if (Model.AvailableBeans.Count > 0)
        {
    <div>
        @(Html.Telerik().Grid(Model.BlendBeans)
                    .Name("blendBeans-grid")
                    .DataKeys(keys =>
                       {
                           keys.Add(x => x.Id);
                       })
                    .Columns(columns =>
                    {
                        columns.Bound(x => x.Bean.Name).Width(200).ReadOnly();
                        columns.Bound(x => x.BeanPercent).Width(100);
                        columns.Command(commands =>
                        {
                            commands.Edit().Text("Edit");
                            commands.Delete().Text("Delete");
                        }).Width(250);

                    })
                    .Editable(x =>
                    {
                        x.Mode(GridEditMode.InLine);
                    })
                    .DataBinding(dataBinding =>
                    {
                        dataBinding.Ajax().Select("BlendBeanByBlendIdList", "Coffee", new { blendId = Model.Id })
                            .Update("BlendBeanUpdate", "Coffee")
                            .Delete("BlendBeanDelete", "Coffee");
                    })
                    .EnableCustomBinding(true))
    </div>
        }
    <p>
        <strong>Add New Blend Bean</strong>
    </p>
    <script type="text/javascript">
        //Handles the click event on the button
        $(document).ready(function () {
            $('#addBlendBean').click(function () {
                var beanId = $("#@Html.FieldIdFor(model => model.BlendBean.Bean)").val();
                var beanPercent = $("#@Html.FieldIdFor(model => model.BlendBean.BeanPercent)").val();
                
                $('#addBlendBean').attr('disabled', true);
                $.ajax({
                    cache: false,
                    type: "POST",
                    url: "@(Url.Action("BlendBeanAdd", "Coffee"))",
                    data: { "blendId": @Model.Id, "beanId": beanId, "beanPercent": beanPercent},
                    success: function (data) {
                        var blendBeanGrid = $("#blendBeans-grid").data('tGrid');
                        blendBeanGrid.ajaxRequest();
                        $('#addBlendBean').attr('disabled', false);
                    },
                    error: function (xhr, ajaxOptions, thrownError){
                        alert('Failed to add blend bean.');
                        $('#addBlendBean').attr('disabled', false);
                    }  
                });
            });
        });
    </script>
    <table class="adminContent">
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.Name)
            </td>
            <td class="adminData">
                @Html.DisplayTextFor(model => model.Name)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.BlendBean.Bean):
            </td>
            <td class="adminData">
                @Html.DropDownListFor(model => model.BlendBean.Bean, Model.AvailableBeans)
                @Html.ValidationMessageFor(model => model.BlendBean.Bean.Name)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.BlendBean.BeanPercent):
            </td>
            <td class="adminData">
                @Html.TextBoxFor(model => model.BlendBean.BeanPercent)
                @Html.ValidationMessageFor(model => model.BlendBean.BeanPercent)
            </td>
        </tr>
        <tr>
            <td colspan="2" align="left">
                <input type="button" id="addBlendBean" class="t-button" value="Add Blend Bean" />
            </td>
        </tr>
    </table>
    
    }
}
